import React from 'react'
import './swiper.css'
import Swiper from './swiper.js'
export default class Swipe extends React.Component{
    render(){
        return (
            <div className="swiper-container">
                <div className="swiper-wrapper">
                    <div className="swiper-slide">Slide 1</div>
                    <div className="swiper-slide">Slide 2</div>
                    <div className="swiper-slide">Slide 3</div>
                </div>
                <div className="swiper-button-prev"></div>
                <div className="swiper-button-next"></div>
            </div>
        )
    }
    componentDidMount(){
        new Swiper('.swiper-container', {
            autoplay: {
                delay: 1000,//1秒切换一次
            },
            // direction: 'vertical',//竖向轮播
            loop: true,//无缝轮播
            // pagination: {//小圆点分页
            //     el: '.swiper-pagination',
            // },
            navigation: {//左右分页
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
            // scrollbar: {//下划线分页
            //     el: '.swiper-scrollbar',
            // }
        })
    }
}